$(function () {
    // console.log(1)
    // 定义分页参数
    let currentPage = 1, perpage = 6
    // 文章列表数据动态渲染
    $.ajax({
        url: bignews.category_list,
        headers: { Authorization: localStorage.getItem('bignews_69_token') },
        // 一页显示20行
        // data: { page: 1, perpage: 20 },
        dataType: 'json',
        success: function (res) {
            console.log(res)
            $('#selCategory').html(template('cateTemp', res))
        }
    })

    // 文章列表数据渲染
    // 原始写法
    // function init() { // 没有封装
    function init(type, state) {
        $.ajax({
            url: bignews.article_query,
            headers: { Authorization: localStorage.getItem('bignews_69_token') },
            // 一页显示20行
            // 原始写法
            // data: { page: 1, perpage: 20 },
            data: { page: currentPage, perpage, type, state },
            dataType: 'json',
            success: function (res) {
                console.log(res)
                $('tbody').html(template('articleListTemp', res))
                // 渲染分页结构

                //res.data.totalPage:
                setPage(res.data.totalPage)
            }
        })
    }
    init()
    // 实现分页结构的动态生成和分页功能
    // pageSum:总页数
    function setPage(pageSum) {
        $(".pagination").bootstrapPaginator({
            // numberOfPages:10
            //设置版本号
            bootstrapMajorVersion: 3,
            // 显示第几页
            currentPage: currentPage,
            // 总页数:总页数不能是0,至少是1
            totalPages: pageSum || 1,
            //当单击操作按钮的时候, 执行该函数, 调用ajax渲染页面
            onPageClicked: function (event, originalEvent, type, page) {
                // page就是用户当前所单击的页码值
                console.log(page)
                // 1.获取当前用户所单击的页码,重置全局的currentPage
                currentPage = page
                // 2.重新发起ajax请求
                // 分页结构生成之后,数据的查询需要考虑当前的筛选条件
                init($('#selCategory').val(), $('#selStatus').val())
            }
        })
    }
    // 实现文章的筛选
    // 筛选的本质就是查询,唯一的区别在于是否有条件,条件在前端看来就是参数
    $('#btnSearch').on('click', function () {
        // 筛选之后,应该重新从第一页开始显示
        currentPage = 1
        console.log($('#selCategory').val())
        console.log($('#selStatus').val())
        init($('#selCategory').val(), $('#selStatus').val())
    })
    //原始方法
    // let type = $('#selCategory').val()
    // let state = $('#selStatus').val()
    // $.ajax({
    //     url: bignews.article_query,
    //     headers: { Authorization: localStorage.getItem('bignews_69_token') },
    //     // 一页显示20行
    //     data: { page: 1, perpage: 20, type, state },
    //     dataType: 'json',
    //     success: function (res) {
    //         console.log(res)
    //         $('tbody').html(template('articleListTemp', res))
    //     }
    // })

    // 点击删除事件
    $('tbody').on('click', '.btndelete', function () {
        // console.log(123)
        let id = $(this).data().id
        $.ajax({
            type: 'post',
            url: bignews.article_delete,
            headers: { Authorization: localStorage.getItem('bignews_69_token') },
            data: { id },
            dataType: 'json',
            success: function () {
                alert('删除成功')
                // 获取当前tbody中的tr的数量
                console.log($('tbody').children())
                if ($('tbody').children().length == 1) {// 说明这一天记录本质是不存在的
                    if (currentPage > 1) currentPage-- //如果页码大于.才能 -- 跳转前一页
                }
                // 页面刷新
                init($('#selCategory').val(), $('#selStatus').val())

                // if ($('tbody').children().length == 1) {
                //     if (currentPage > 1) {
                //         currentPage--
                //     }
                // }
                // init($('#selCategory').val(), $('#selStatus').val())
            }
        })
    })

    // 切换(改变)每页显示数量
    // $('#showCount').on('change', function () {
    //     console.log($(this).val())
    //     currentPage = 1
    //  // perpage 页码
    //     perpage = $(this).val()
    //     init($('#selCategory').val(), $('#selStatus').val())
    // })

    $('#showCount').on('change', function () {
        console.log($(this).val())
        currentPage = 1
        perpage = $(this).val()
        init($('#selCategory').val(), $('#selStatus').val())

    })
})